Dashboard Temp Share Shortlinks Frames API

HTMLify

checkout.html
Views: 27 | Author: learnearn-fun 
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Welcome to Gorge Mall!</title>
    <link rel="stylesheet" href="CSS/Layout.css" type="text/css" />
</head>
<body>
    <header>
        <div>
            <a class="headerlogo" href="CSS/index.html">
                <img src="img/Logo.png" />
            </a>
            <span id="headername">Gorge Mall</span>
            <input type="search" class="searchbox" placeholder="Search our store" />
        </div>
        <nav class="backgroundgradient">
            <ul>
                <li><a class="navlink" href="HTML/index.html" >Home</a></li>
                <li><a class="navlink" href="HTML/blog.html" >Blog</a></li>
                <li><a class="navlink" href="HTML/Offers.html">Offers</a></li>
                <li><a class="navlink" href="HTML/Cart.html">Cart</a></li>
                <li><a class="navlink" href="HTML/Payment Offers.html">Payment Offers</a></li>
                <li><a class="navlink" href="HTML/findus.html">Find us</a></li>
                <li><a class="navlink" href="HTML/checkout.html">Checkout</a></li>
                
            </ul>
        </nav>
    </header>
    <div id="welcomeimage">
        <img src="img/Welcome photo.jfif" />
    </div>
    <div id="coffeeofthemonth">
        <img src="img/Lenovo.jfif" />
    </div>

    <section class="coffeedetails">
        <header class="blockheader">
            <span>Checkout</span>
        </header>
        <form id="mainForm" action="#" method="post">
            <fieldset class="box">
                <legend>Your details</legend>
                <div>
                    <p>
                        <label class="textlabel" for="firstNameInput">First Name</label>
                        <input id="firstNameInput" name="FirstName" type="text"
                               required="required" maxlength="30"
                               autofocus="autofocus"
                               placeholder="Enter your first name" class="textinput" />
                    </p>
                    <p>
                        <label class="textlabel" for="lastNameInput">Last Name</label>
                        <input id="lastNameInput" name="LastName" type="text" required="required"
                               placeholder="Enter your last name" class="textinput" size="10" maxlength="50" />
                    </p>
                    <p>
                        <label class="textlabel" for="emailInput">Email</label>
                        <input id="emailInput" name="Email" type="email" class="textinput"
                               required="required" placeholder="Please enter your email address" />
                    </p>

                    <p>
                        <label class="textlabel" for="streetInput">Street</label>
                        <input id="streetInput" name="Street" type="text" class="textinput"
                               required="required" placeholder="Please enter your shipping street" />
                    </p>

                    <p>
                        <label class="textlabel" for="numberInput">Number</label>
                        <input id="numberInput" name="Number" type="text" class="textinput"
                               required="required" placeholder="Please enter your street number" />
                    </p>

                    <p>
                        <label class="textlabel" for="zipInput">ZIP code</label>
                        <input id="zipInput" name="Zip" type="text" class="textinput"
                               required="required" placeholder="Please enter your zip code" />
                    </p>
                    <p>
                        <label class="textlabel" for="cityInput">City</label>
                        <input id="cityInput" name="City" type="text" class="textinput"
                               required="required" placeholder="Please enter your city" />
                    </p>
                    <p>
                        <label class="textlabel" for="countryInput">Country</label>
                        <input id="countryInput" name="Country" type="text" required="required"
                               placeholder="Please enter your country (3 letter code)" pattern="[a-za-z]{3}" />
                    </p>
                    <p>
                        <label class="textlabel" for="phoneInput">Phone number</label>
                        <input id="phoneInput" name="PhoneNumber" type="text" class="textinput"
                               required="required" placeholder="Please enter your phone number" />
                    </p>
                    <p>
                        <label class="textlabel" for="blogInput">Blog</label>
                        <input id="blogInput" name="Blog" type="url" class="textinput"
                               placeholder="Please enter your blog address if you have one" />
                    </p>
                    <p>
                        <label class="textlabel" for="remarkInput">Remarks</label>
                        <input id="remarkInput" name="PhoneNumber" type="text" class="textinput"
                               placeholder="Please enter any extra remarks you have here." />
                    </p>
                </div>
            </fieldset>
            <br />
            <fieldset class="box">
                <legend>Your order</legend>
                <div>
                    <p>
                        <label class="textlabel" for="deliveryDateInput">Requested delivery date</label>
                        <input id="deliveryDateInput" name="BirthDate" class="textinput"
                               type="date" placeholder="Enter a date" />
                    </p>
                    <p>
                        <label class="textlabel" for="colorInput">Wrapping paper color</label>
                        <input id="colorInput" name="Color" type="color" class="textinput"
                               placeholder="Select a color" />
                    </p>
                    <p>
                        <label class="textlabel" for="bowInput">How many bows on the package?</label>
                        <input id="bowInput" name="Bows" type="number" class="textinput"
                               required="required" placeholder="Enter a number" max="10" min="1" />
                    </p>
                </div>
            </fieldset>
            <input type="submit" class="submitbutton" value="Place order" />

        </form>
    </section>
</body>
</html>

Share this file: